<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="../common/common.jsp"%>
<link rel="stylesheet" href="${ctx}/page/topic/css/topicDetail.css" />
<script type="text/javascript" src="${ctx}/page/topic/js/topicDetail.js"></script>

<title>${topic.title}</title>
</head>
<body>
	<div class="wrapper">
		<%@ include file="../common/header.jsp"%>
		<div class="container">
			<div class="row">
				<div class="col-md-9">
					<div class="panel panel-default">
						<div class="panel-body topic-detail-header">
							<div class="media">
								<div class="media-body">
									<h2 class="topic-detail-title">${topic.title}</h2>
									<p class="gray">
										<span class="label label-default">${topic.section.name}</span> 
										<span><a style="color: #999999" href="#">${topic.member.name}</a></span> 
										<span>•</span> <span>${topic.formatDate(topic.createTime)}</span>
										<span>•</span> <span>${topic.collectCounts}个收藏</span> 
										<span>•</span> <span>${topic.viewCounts}次浏览</span>
										<c:if test="${topic.modifyTime ne null}">
										 	<small>&nbsp最近修改时间：<fmt:formatDate value="${topic.modifyTime}" type="both" pattern="yyyy-MM-dd HH:mm:ss" /></small>
										</c:if>
										<c:if test="${topic.member.id eq member.id}">
											<span>•</span> <a href="${ctx}/topic/updateTopicView?topicId=${topic.id}">修改</a> 
										</c:if>
									</p>
								</div>
							</div>
						</div>
						<div class="divide"></div>
						<div class="panel-body topic-detail-content contentDetail">
							${topic.markedownToHtml(topic.content)}
						</div>
						<div class="panel-footer">
								<c:if test="${member ne null}">
									<c:if test="${member.id ne topic.member.id}">
										<button id="collect" name="collect" type="button" onclick="changeCollect()" class="btn btn-default btn-sm pull-right">
										<c:if test="${isCollect}">
											<span class="glyphicon glyphicon-star"></span>
											取消收藏
										</c:if>
										<c:if test="${!isCollect}">
											<span class="glyphicon glyphicon-star-empty"></span>
											加入收藏
										</c:if>
										</button>
									</c:if>
								</c:if>
								<div class="bdsharebuttonbox" data-tag="share_1">
									<a class="bds_qzone" data-cmd="qzone" href="#"></a>
									<a class="bds_tsina" data-cmd="tsina"></a>
									<a class="bds_weixin" data-cmd="weixin"></a>
								</div>
								<input type="hidden" id="isCollect" name="isCollect" value="${isCollect}">
						</div>
					</div>
					<c:if test="${replyCounts eq 0}">
						<div class="panel panel-default">
	        				<div class="panel-body text-center">目前暂无回复</div>
	      				</div>
      				</c:if>
					<c:if test="${replyCounts gt 0}">
						<%@ include file="../include/replies.jsp"%>
					</c:if>
					<c:if test="${member ne null}">
						<div class="panel panel-default">
							<div class="panel-heading">
								添加一条新回复 <a href="javascript:;" id="goTop" class="pull-right">回到顶部</a>
							</div>
							<div class="panel-body">
								<form action="${ctx}/topic/addReply" method="post" id="replyForm">
									<div class="form-group">
										<textarea name="content" id="content" rows="5" class="form-control"></textarea>
										<input type="hidden" id="topicId" name="topicId" value="${topic.id}">
										<input type="hidden" id="toMemberId" name="toMemberId">
										<input type="hidden" id="defaultToMemberId" name="defaultToMemberId" value="${topic.member.id}">
									</div>
									<button type="button" onclick="replySubmit();" class="btn btn-default">回复</button>
									<span id="error_message"></span>
								</form>
							</div>
						</div>
					</c:if>
				</div>
				<div class="col-md-3 hidden-sm hidden-xs">
					<%@ include file="../include/authorInfo.jsp"%>
					<c:if test="${otherTopics.size() gt 0}">
						<%@ include file="../include/authorOtherTopics.jsp"%>
					</c:if>
				</div>
			</div>
		</div>
		<input type="hidden" id="topicId" name="topicId" value="${topic.id}">
		<%@ include file="../common/footer.jsp"%>
	</div>
	<link rel="stylesheet" href="${ctx}/static/libs/editor/editor.css" />
	<script type="text/javascript" src="${ctx}/static/js/lodash.min.js"></script>
	<script type="text/javascript" src="${ctx}/static/libs/webuploader/webuploader.withoutimage.js"></script>
	<script type="text/javascript" src="${ctx}/static/libs/markdownit.js"></script>
	<script type="text/javascript" src="${ctx}/static/libs/editor/editor.js"></script>
	<script type="text/javascript" src="${ctx}/static/libs/editor/ext.js"></script>
	<script type="text/javascript">
		var editor = new Editor({
			element : $("#content")[0],
			status : []
		});
		editor.render();
	</script>
	<script>
		var id = '${topic.id}';
		var title = '${topic.title}';
		var summary = '${topic.summary}';
		var bbsUrl = '${bbsUrl}';
		var shareImage = '${shareImage}';
		window._bd_share_config = {
			common : {
				bdText : title,	
				bdDesc : summary,
				bdUrl : bbsUrl+'/topic/'+id, //上线后设为动态
				bdPic : shareImage
			},
			share : [{
				"bdSize" : 16 //分享按钮的尺寸
			}]
		}
		with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?cdnversion='+~(-new Date()/36e5)];
	</script>
</body>
</html>